﻿<!DOCTYPE html>
<html>
<head>
    <title>登录</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <!--    引入vue-->
    <script src="js/vue.min.js"></script>

    <!--    引入axios-->
    <script src="js/axios.min.js"></script>
    <link href="css/style.css" rel="stylesheet" type="text/css" media="all"/>
    <!-- //Custom Theme files -->
</head>
<body>
<!-- main -->
<div class="main-w3layouts wrapper" id="app">
    <h1>作业管理系统</h1>
    <br>
    <br>
    <h1>登录</h1>
    <div class="main-agileinfo">
        <div class="agileits-top">
            <input class="text" type="text" name="Username" placeholder="Username" required="" v-model="postData.name">
            <input class="text" type="password" name="password" placeholder="Password" required=""
                   v-model="postData.password">
            <div class="wthree-text">
                <ul>
                    <li>
                        <label class="anim">
                            <input type="radio" class="checkbox" name="identity" value="student" required=""
                                   v-model="postData.identity">
                            <span>学生</span>
                        </label>
                        <label class="anim">
                            <input type="radio" class="checkbox" name="identity" value="teacher" required=""
                                   v-model="postData.identity">
                            <span>老师</span>
                        </label>
                        <label class="anim">
                            <input type="radio" class="checkbox" name="identity" value="admin" required=""
                                   v-model="postData.identity">
                            <span>管理员</span>
                        </label>
                    </li>
                </ul>
                <div class="clear"></div>
            </div>
            <input type="submit" value="登录" @click="login">
            <p>创建一个账号? <a href="/static/register.html"> 立即注册!</a></p>
        </div>
    </div>
    <!-- copyright -->
    <div class="w3copyright-agile">
        <p><a href="https://beian.miit.gov.cn/" title="beianhao">粤ICP备2022094843</a></p>
    </div>
    <!-- //copyright -->
    <ul class="w3lsg-bubbles">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>
<script>
    new Vue({
        el: "#app",
        mounted() {
        },
        data() {
            return {
                //表格的数据
                postData: {
                    id:2
                },
                no: '好的'
            };
        },
        created() {
            //钩子函数
        },
        methods: {
            //提交表单数据
            login() {
                //发送请求数据
                axios.post("/login", this.postData).then((res) => {
                    console.log(this.postData)
                    if (res.data.status !== 200) {
                        alert("服务器出错");
                        return;
                    }

                    if (!res.data.ret) {
                        alert("密码错误");
                        return;
                    }

                    this.postData.id=res.data.id
                    if (this.postData.identity === "student") {
                        window.location.href = '/static/student.html?obj=' + JSON.stringify(this.postData);
                    } else if (this.postData.identity === "teacher") {
                        window.location.href = '/static/teacher.html?obj=' + JSON.stringify(this.postData);
                    } else if (this.postData.identity === "admin") {
                        window.location.href = '/static/admin.html?obj=' + JSON.stringify(this.postData);
                    }
                });
            },
        },
    });
</script>
<!-- //main -->
</body>
</html>
